<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>摩尔斯电码</title>
  <style>
    body {
      text-align: center;
    }

    input,
    textarea {
      size: 12px;
    }
  </style>
</head>

<body>
  <h3>摩丝码转码</h3>
  <p>/*请输入摩丝码（例如：转码1.....为5；转码2：5为.....）*/</p>
  <input type="text" value="" class="zmStart">
  <button class="zm">转码1</button>
  <button class="zm1">转码2</button>
  <button class="qk">清空</button>
  <br>
  <br>
  <textarea name="" id="" cols="30" rows="10" class="zmEnd" style="height: 115px;width: 315px;"></textarea>


  <h3>例子解密</h3>
  <p>
    /*请输入故事中的摩丝码：....-/.----/----./....-/....-/.----/---../.----/....-/.----/-..../...--/....-/.----/----./..---/-..../..---/..---/...--/--.../....-
    */
  </p>
  <input type="text" value="" class="lz">
  <button class="jiem1">解密</button>
  <button class="jiam">加密</button>
  <button class="qk1">清空</button>
  <br>
  <br>
  <textarea name="" id="" cols="30" rows="10" class="jiem" style="height: 115px;width: 315px;"></textarea>


  <script>
    //获取元素
    //解密元素
    const jiem1 = document.querySelector('.jiem1')
    const lz = document.querySelector('.lz')
    const jiem = document.querySelector('.jiem')
    const jiam = document.querySelector('.jiam')

    //转码元素
    const zm = document.querySelector('.zm')
    const zm1 = document.querySelector('.zm1')
    const zmStart = document.querySelector('.zmStart')
    const zmEnd = document.querySelector('.zmEnd')

    //清空元素
    const qk = document.querySelector('.qk')
    const qk1 = document.querySelector('.qk1')

    //添加点击事件
    //清空事件
    qk.addEventListener('click', function () {
      zmStart.value = ''
      zmEnd.value = ''
    })
    qk1.addEventListener('click', function () {
      jiem.value = ''
      lz.value = ''
    })

    //转码事件1
    zm.addEventListener('click', dj)
    function dj() {
      //创建对象 将摩尔斯码的值一一列出
      const mrs = {
        '.-': 'A', '-...': 'B', '-.-.': 'C', '-..': 'D', '.': 'E', '..-.': 'F', '--.': 'G', '....': 'H',
        '..': 'I', '.---': 'J', '-.-': 'K', '.-..': 'L', '--': 'M', '-.': 'N', '---': 'O', '.--.': 'P',
        '--.-': 'Q', '.-.': 'R', '...': 'S', '-': 'T', '..-': 'U', '...-': 'V', '.--': 'W', '-..-': 'X',
        '-.--': 'Y', '--..': 'Z',
        '.----': 1, '..---': 2, '...--': 3, '....-': 4, '.....': 5, '-....': 6, '--...': 7,
        '---..': 8, '----.': 9, '-----': 0, '/': ','
      }
      //将要转码的值以/分开形成多个字符串，通过map依次遍历/分开的值，在mrs对象中找到与a对象名相同的值形成新一个数组[''/''/····]，通过join将数组转为字符串
      let vl = zmStart.value.split('/').map(a => mrs[a]).join('')
      //将vl的值给zmEnd
      zmEnd.value = vl
      //清空zmStart里的值
      zmStart.value = ''
    }
    //转码事件2
    zm1.addEventListener('click', function () {
      const mrs = {
        'A': '.-', 'B': '-...', 'C': '-.-.', 'D': '-..', 'E': '.', 'F': '..-.', 'G': '--.', 'H': '....',
        'I': '..', 'J': '.---', 'K': '-.-', 'L': '.-..', 'M': '--', 'N': '-.', 'O': '---', 'P': '.--.',
        'Q': '--.-', 'R': '.-.', 'S': '...', 'T': '-', 'U': '..-', 'V': '...-', 'W': '.--', 'X': '-..-',
        'Y': '-.--', 'Z': '--..', 1: '.----', 2: '..---', 3: '...--', 4: '....-', 5: '.....', 6: '-....', 7: '--...', 8: '---..', 9: '----.', 0: '-----'
      }
      //通过split（''）将字符串转为数组['','','',·····]，后通过map遍历找到mrs对象中相应的值形成一个新的数组，通过join（'/'）将数组转成用/分隔的字符串
      let vl = zmEnd.value.split('').map(a => mrs[a]).join('/')
      //将vl的值给zmStart
      zmStart.value = vl
      //清空zmEnd里的值
      zmEnd.value = ''
    })

    //创建对应的数组
    let arr = ['21', '22', '23', '31', '32', '33', '41', '42', '43', '51', '52', '53', '61', '62', '63', '71', '72', '73', '74', '81', '82', '83', '91', '92', '93', '94']
    let arr1 = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z']
    let arr2 = ['q', 'w', 'e', 'r', 't', 'y', 'u', 'i', 'o', 'p', 'a', 's', 'd', 'f', 'g', 'h', 'j', 'k', 'l', 'z', 'x', 'c', 'v', 'b', 'n', 'm']

    //例子解密
    jiem1.addEventListener('click', dj1)
    function dj1() {
      //创建对象 将摩尔斯码的值一一列出
      const mrs = {
        '.-': 'A', '-...': 'B', '-.-.': 'C', '-..': 'D', '.': 'E', '..-.': 'F', '--.': 'G', '....': 'H',
        '..': 'I', '.---': 'J', '-.-': 'K', '.-..': 'L', '--': 'M', '-.': 'N', '---': 'O', '.--.': 'P',
        '--.-': 'Q', '.-.': 'R', '...': 'S', '-': 'T', '..-': 'U', '...-': 'V', '.--': 'W', '-..-': 'X',
        '-.--': 'Y', '--..': 'Z',
        '.----': 1, '..---': 2, '...--': 3, '....-': 4, '.....': 5, '-....': 6, '--...': 7,
        '---..': 8, '----.': 9, '-----': 0, '/': ','
      }
      //创建数组

      let arr4 = []
      let arr5 = []
      let arr6 = []
      let vl1 = ''
      //将输入的摩尔斯转码  用/作为摩尔斯码的间隔
      //通过split('/')将用/分隔的字符串转成数组，通过map遍历将mrs对象中与a对应的形成新的数组
      let vl = lz.value.split('/').map(a => mrs[a])
      //判断对象中元素是不是数字型的函数
      function pdnmber(obj) {
        //对象的遍历
        for (let k in obj) {
          // 判断对象中所有的值是不是数字型
          if (typeof obj[k] !== 'number') {
            return false;
          }
        }
        return true;
      }
      //判断
      if (pdnmber(vl)) {

        //创建一个空数组
        let arr3 = []
        //获取对象的循序
        let i = Object.keys(vl)
        //遍历vl对象,将对象里两两的元素添加到新的数组，k+=2 每次加2
        for (let k = 0; k < i.length; k += 2) {
          arr3.push(`${vl[k]}${vl[k + 1]}`)
        }
        //判断如果arr中有arr3的值那么就进行下一步的解密
        if (arr.indexOf(arr3) === -1) {

          //9宫格解码
          for (let i = 0; i < arr3.length; i++) {
            //获取arr3[i]与arr相对应的值的索引,之后通过arr的索引去找arr1相对索引的值
            arr3[i] = arr1[arr.indexOf(arr3[i])]
          }
          console.log(arr3)
        }

        //键盘解码
        for (let i = 0; i < arr3.length; i++) {
          //获取arr3[i]与arr2相对应的值的索引,之后通过arr2的索引去找arr1相对索引的值
          arr3[i] = arr1[arr2.indexOf(arr3[i])]
        }
        console.log(arr3)
        //将通过键盘解码的数组变成两个数组
        for (let i = 0; i < arr3.length; i++) {
          i > (arr3.length / 2) ? arr4.push(arr3[i]) : arr5.push(arr3[i])
        }
        console.log(arr4.length)
        console.log(arr5)
        //通过遍历将两个数组按索引相同来排序
        for (let i = 0; i < arr5.length; i++) {
          //判断，因为有一个数组是多一个元素的所以一起添加最后一个元素会为nudefined，所以进行判断
          if (arr4[i] == undefined) {
            arr6.push(arr5[i])
          } else {
            arr6.push(`${arr5[i]}${arr4[i]}`)
          }
        }
        //将arr6数组通过join('')将数组中每个元素转为字符串，再通过spilt（''）将字符串转为用，隔开的数组，再通过reverse将数组倒着排序，最后再转为字符串
        vl1 = arr6.join('').split('').reverse('').join('')
      }
      //将jiem里的值转为大写
      jiem.value = vl1.toUpperCase()
      //清空lz里的值
      lz.value = ''
    }


    //例子加密
    jiam.addEventListener('click', function () {
      const mrs = {
        'A': '.-', 'B': '-...', 'C': '-.-.', 'D': '-..', 'E': '.', 'F': '..-.', 'G': '--.', 'H': '....',
        'I': '..', 'J': '.---', 'K': '-.-', 'L': '.-..', 'M': '--', 'N': '-.', 'O': '---', 'P': '.--.',
        'Q': '--.-', 'R': '.-.', 'S': '...', 'T': '-', 'U': '..-', 'V': '...-', 'W': '.--', 'X': '-..-',
        'Y': '-.--', 'Z': '--..', 1: '.----', 2: '..---', 3: '...--', 4: '....-', 5: '.....', 6: '-....', 7: '--...', 8: '---..', 9: '----.', 0: '-----'
      }
      //创建数组
      let a = []
      let b = []
      let arr0 = []
      //声明空变量
      let vl1 = ''
      let vl2 = ''
      //先转为数组再倒序最后转为字符串
      let vl = jiem.value.split('').reverse('').join('')
      //将vl分成两个数组
      for (let i = 0; i < vl.length; i++) {
        i % 2 == 0 ? a.push(vl[i]) : b.push(vl[i])
      }
      console.log(a)
      console.log(b)
      //将两个数组加到arr0数组中
      for (let i = 0; i < a.length; i++) {
        arr0.push(a[i])
      }
      for (let i = 0; i < b.length; i++) {
        arr0.push(b[i])
      }
      console.log(arr0)

      //将数组里的字母变成小写
      for (let i = 0; i < arr0.length; i++) {
        arr0[i] = arr0[i].toLowerCase()
      }
      console.log(arr0)

      //键盘加密
      for (let i = 0; i < arr0.length; i++) {
        arr0[i] = arr2[arr1.indexOf(arr0[i])]
      }
      console.log(arr0)

      //9宫格加密
      for (let i = 0; i < arr0.length; i++) {
        arr0[i] = arr[arr1.indexOf(arr0[i])]
      }
      console.log(arr0)

      vl1 = arr0.join('').split('')
      console.log(vl1)
      //将对象中的值加到vl2空字符串中
      for (let i = 0; i < vl1.length; i++) {
        vl2 = vl2 + `${mrs[vl1[i]]}/`
      }
      console.log(vl2)
      //将vl2里的值给lz
      lz.value = vl2
      //将jiem的值清空
      jiem.value = ''
    })


  </script>
</body>

</html>